<template>
	<div class="box" style="background: #fff;padding: 10px; box-sizing: border-box;">
		<div style="height: 89vh; overflow-y: auto;">
			<view class="section-header">
				<view class="section-icon">👤</view>
				<view class="section-title">基本信息</view>
			</view>
			<van-cell-group>
				<van-field :border="false" label="简历头像" readonly center input-align="right">
					<van-uploader :file-list="fileList" max-count="1" @delete="deleteImages" @after-read="afterRead"
						slot="button" />
				</van-field>
				<van-field :value="addForm.name" placeholder="请输入姓名" label="姓名" input-align="right"
					@change="changeInput($event, 'name')" />

				<van-field :value="addForm.age" placeholder="请输入年龄" label="年龄" input-align="right"
					@change="changeInput($event, 'age')" />

				<van-field :value="addForm.gender" placeholder="请输入性别" label="性别" input-align="right"
					@change="changeInput($event, 'gender')" />

				<van-field :value="addForm.phone" placeholder="请输入联系方式" label="联系方式" input-align="right"
					@change="changeInput($event, 'phone')" />

				<van-field :value="addForm.email" placeholder="请输入邮箱" label="邮箱" input-align="right"
					@change="changeInput($event, 'email')" />

				<van-field :value="addForm.schoolGraduation" placeholder="请输入毕业院校" label="毕业院校" input-align="right"
					@change="changeInput($event, 'schoolGraduation')" />

				<van-field :value="addForm.education" placeholder="请输入学历" label="学历" input-align="right"
					@change="changeInput($event, 'education')" />

				<van-field :value="addForm.major" placeholder="请输入专业" label="专业" input-align="right"
					@change="changeInput($event, 'major')" />

				<van-field :value="addForm.workYears" placeholder="请输入工作年限" label="工作年限" input-align="right"
					@change="changeInput($event, 'workYears')" />
			</van-cell-group>

			<view class="section-header">
				<view class="section-icon">🎯</view>
				<view class="section-title">求职意向</view>
			</view>

			<van-cell-group>
				<van-field :value="addForm.intendedJob" placeholder="请输入意向岗位" label="意向岗位" input-align="right"
					@change="changeInput($event, 'intendedJob')" />

				<van-field :value="addForm.expectedLocation" placeholder="请输入期望工作地点" label="期望工作地点" input-align="right"
					@change="changeInput($event, 'expectedLocation')" />

				<van-field :value="addForm.expectedSalary" placeholder="请输入期望薪资" label="期望薪资" input-align="right"
					@change="changeInput($event, 'expectedSalary')" />

				<van-field :value="addForm.availableTime" placeholder="请输入到岗时间" label="到岗时间" input-align="right"
					@change="changeInput($event, 'availableTime')" />

				<van-field :value="addForm.expectedIndustry" placeholder="请输入期望行业" label="期望行业" input-align="right"
					@change="changeInput($event, 'expectedIndustry')" />
			</van-cell-group>

			<view class="section-header">
				<view class="section-icon">🌟</view>
				<view class="section-title">个人评价</view>
			</view>

			<van-cell-group> 
				<van-field :value="addForm.personalEvaluation" placeholder="请输入个人评价"  input-align="left" autosize
					type="textarea" :rows="4" @change="changeInput($event, 'personalEvaluation')" />
			</van-cell-group>
		</div>

		<button class="amusingBtn" @click="save">
			<van-icon name="add-o" style="margin-right: 5px"></van-icon>
			保存
		</button>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				addForm: {},
				fileList: [],
				showHomeClass: false,
			};
		},

		onLoad() {
			this.getInit()
		},

		methods: {
			async getInit() {
				let result = await this.$axios('overallSituation', {
					state: 'look',
					databaseName: "resumeDetail",
				}, true)
				if (result.code == 200) {
					this.fileList = []
					this.addForm = result.data[0] || {}
					if (this.addForm.resumeUrl) {
						this.fileList.push({
							url: this.addForm.resumeUrl
						})
					}
				}
			},

			// 保存按钮
			async save() {
				if (!this.verify()) return;
				// 上传简历头像
				if (
					this.fileList.length != 0 &&
					!this.fileList[0].url.includes("https://")
				) {
					let imageRes = await uniCloud.uploadFile({
						filePath: this.fileList[0].url,
						cloudPath: "简历头像" + this.$getFileExtensionName(this.fileList[0].url),
						header: {
							"Content-Type": "multipart/form-data",
						},
					});

					this.addForm.resumeUrl = imageRes.fileID;
				}

				let result = await this.$axios(
					"overallSituation", {
						state: this.addForm._id ? 'update' : 'add',
						databaseName: "resumeDetail",
						...this.addForm,
					},
					true
				);

				this.$showToast(`${result.code == 200 ? '操作成功' : '操作失败'}`)
				this.getInit()
			},

			// 校验表单信息
			verify() {
				let flag = false;
				for (let key in this.addForm) {
					if (!this.addForm[key].toString() && key != "isLoagin") {
						flag = true;
					}
				}
				if (flag) {
					uni.showToast({
						title: "简历信息不完整",
						icon: "none",
					});
					return false;
				}

				// 判断是否有图片
				if (this.fileList.length == 0) {
					uni.showToast({
						title: "简历头像不能为空",
						icon: "none",
					});
					return false;
				}

				return true;
			},

			// 输入框内容发生变化
			changeInput(e, str) {
				this.addForm[str] = e.detail;
			},

			// 文件上传
			afterRead(e) {
				this.fileList.push({
					url: e.detail.file.url,
				});
			},

			// 删除图片回调函数
			deleteImages(e) {
				this.fileList.splice(e.detail.index, 1);
			},
		},
	};
</script>

<style scoped>
	.section-header {
		display: flex;
		align-items: center;
		margin-bottom: 20rpx;
		margin-top: 20rpx;
	}

	.section-icon {
		font-size: 28rpx;
		margin-right: 12rpx;
		width: 36rpx;
		height: 36rpx;
		background-color: #eff6ff;
		color: #3b82f6;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.section-title {
		font-size: 28rpx;
		font-weight: 600;
		color: #1e293b;
	}
</style>